<template>
	<view :style="[{paddingTop: `calc(15vh)`, paddingBottom: '50px'}]">

		<cu-custom bgColor="bg-gradual-pink" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">设备维修</block>
		</cu-custom>

		<scroll-view scroll-x class="bg-white padding response cu-steps steps-bottom stepWrap"
			:style="[{top: CustomBar + 'px'}]" :scroll-into-view="'scroll-' + scroll" scroll-with-animation
			style="height: 15vh;">
			<view class="cu-item padding-lr-xl" :class="index>scroll?'':'text-blue'" v-for="(item,index) in basicsList"
				:key="index" :id="'scroll-' + index">
				{{item.name }} <text class="num" :data-index="index + 1" @click="getStep(index, item.idName)"></text>
			</view>
		</scroll-view>

		<!-- <scroll-view class="bg-white " scroll-y :style="[{height:'calc(100vh - ' + CustomBar + 'px - 22vh)'}]"> -->
		<view class="padding-lr-xl">
			<view class="padding-sm flex solid-bottom bg-grey align-center" id='step0'>
				<view class="flex-2">
					<text class="text-bold">1：维修设备信息</text>
				</view>
			</view>

			<view class="padding-sm flex align-center solid-bottom">
				<view class="flex-2">
					<text class="text-red margin-right-xs">*</text>
					<text class="text-bold">客户名称：</text>
				</view>
				<view class="flex-3 ">
					<input v-model="formInfo.customerName" class="text-sm" style="width: 100%;" type="text"
						placeholder="暂未生成" />
				</view>
			</view>

			<view class="padding-sm flex align-center solid-bottom">
				<view class="flex-2">
					<text class="text-red margin-right-xs">*</text>
					<text class="text-bold">维修时间：</text>
				</view>

				<view class="flex-6 padding-xs text-grey">
					<uni-datetime-picker class="flex-1" type="datetime" v-model="formInfo.repairTime"
						@change="repairTimeChange" />
				</view>

			</view>
			<view class="padding-sm flex align-center solid-bottom">
				<view class="flex-2">
					<text class="text-red margin-right-xs">*</text>
					<text class="text-bold">检验标准：</text>
				</view>
				<view class="flex-3">
					<input v-model="formInfo.inspectionStandard" class="text-sm" style="width: 100%;" type="text"
						placeholder="暂未生成" />
				</view>
			</view>

			<view class="padding-sm flex align-center ">
				<view class="flex-3">
					<text class="text-bold">设备/工具器存放地点：</text>
				</view>
			</view>
			<view class="padding-sm flex align-center solid-bottom">
				<view class="flex-3 ">
					<input v-model="formInfo.storageRegion" class="text-sm" style="width: 100%;" type="text"
						placeholder="暂未生成" />
				</view>
			</view>

			<view class="padding-sm flex align-center solid-bottom">
				<view class="flex-2">
					<!-- <text class="text-red margin-right-xs">*</text> -->
					<text class="text-bold">UTC编码：</text>
				</view>
				<view class="flex-3 ">
					<view class="text-grey">
						{{formInfo.utcCode}}
					</view>
					<!-- <input v-model="formInfo.utcCode" class="text-sm" style="width: 100%;" type="text"
						placeholder="暂未生成" /> -->
				</view>
			</view>
			<view class="padding-sm flex align-center solid-bottom">
				<view class="flex-2">
					<!-- <text class="text-red margin-right-xs">*</text> -->
					<text class="text-bold">出厂编码：</text>
				</view>
				<view class="flex-3 ">
					<view class="text-grey">
						{{formInfo.serialNumber}}
					</view>
					<!-- <input v-model="formInfo.serialNumber" class="text-sm" style="width: 100%;" type="text"
						placeholder="暂未生成" /> -->
				</view>
			</view>

			<view class="padding-sm flex align-center ">
				<view class="flex-3">
					<!-- <text class="text-red margin-right-xs">*</text> -->
					<text class="text-bold">设备/工器具物料编码：</text>
				</view>
			</view>
			<view class="padding-sm flex align-center solid-bottom">
				<view class="flex-3 ">
					<view class="text-grey">
						{{formInfo.materialCode}}
					</view>
					<!-- <input v-model="formInfo.materialCode" class="text-sm" style="width: 100%;" type="text"
						placeholder="暂未生成" /> -->
				</view>
			</view>
			<view class="padding-sm flex align-center ">
				<view class="flex-3">
					<!-- <text class="text-red margin-right-xs">*</text> -->
					<text class="text-bold">设备/工具器名称：</text>
				</view>
			</view>
			<view class="padding-sm flex align-center solid-bottom">
				<view class="flex-3 ">
					<view class="text-grey">
						{{formInfo.toolName}}
					</view>
					<!-- 	<input v-model="formInfo.toolName" class="text-sm" style="width: 100%;" type="text"
						placeholder="暂未生成" /> -->
				</view>
			</view>


			<view class="padding-sm flex align-center ">
				<view class="flex-3">
					<!-- <text class="text-red margin-right-xs">*</text> -->
					<text class="text-bold">设备/工具器型号/参数：</text>
				</view>
			</view>
			<view class="padding-sm flex align-center solid-bottom">
				<view class="flex-3 ">
					<view class="text-grey">
						{{formInfo.model}}
					</view>
					<!-- 	<input v-model="formInfo.model" class="text-sm" style="width: 100%;" type="text"
						placeholder="暂未生成" /> -->
				</view>
			</view>

			<view class="padding-sm flex align-center solid-bottom">
				<view class="flex-2">
					<!-- <text class="text-red margin-right-xs">*</text> -->
					<text class="text-bold">库位：</text>
				</view>
				<view class="flex-3 ">
					<view class="text-grey">
						{{formInfo.storageLocation}}
					</view>
					<!-- <input v-model="formInfo.storageLocation" class="text-sm" style="width: 100%;" type="text"
						placeholder="暂未生成" /> -->
				</view>
			</view>






			<view class="padding-sm flex solid-bottom bg-grey" id='step1'>
				<view class="flex-2">
					<text class="text-bold">2：确认维修方法</text>
				</view>
			</view>




			<view class="padding-sm flex solid-bottom">
				<view class="flex-2">
					<text class="text-red margin-right-xs">*</text>
					<text class="text-bold">维修方法：</text>
				</view>
				<view class="flex-3">
					<uni-data-checkbox v-model="formInfo.repairMethod" :localdata="range"></uni-data-checkbox>
				</view>
			</view>



			<view class="padding-sm flex solid-bottom bg-grey" id='step2'>
				<view class="flex-2">
					<text class="text-bold">3：解体检查</text>
				</view>
			</view>


			<view class="padding-sm flex">
				<view class="flex-1">
					<text class="text-red margin-right-xs">*</text>
					<text class="text-bold">缺陷是否可修：</text>
				</view>
			</view>
			<view class="flex">
				<view class="flex-3">
					<uni-data-checkbox v-model="formInfo.isRepairable" :localdata="range2"></uni-data-checkbox>
				</view>
			</view>

			<view class="padding-sm flex align-center solid-bottom">
				<view class="flex-1">
					<text class="text-red margin-right-xs">*</text>
					<text class="text-bold">说明：</text>
				</view>
				<view class="flex-3 ">
					<input v-model="formInfo.defectDescribe" class="text-sm" style="width: 100%;" type="text"
						placeholder="暂未生成" />
				</view>
			</view>

			<block v-if="isRepair">
				<view class="padding-sm solid-bottom">
					<view class="">
						<text class="text-bold">缺陷图片：</text>
					</view>
					<view class="margin-top-sm padding-sm">
						<htz-image-upload @imgDelete="imgDelete($event, 'defectImage')" :imgLoading="imgLoading"
							:max="10" v-model="formInfo.defectImageList" data-name="ceshiData"
							@chooseSuccess="zidingyiSuccess($event, 'defectImage', 'defectImageList')">
						</htz-image-upload>
					</view>
				</view>

				<view class="padding-sm flex solid-bottom bg-grey" id='step3'>
					<view class="flex-2">
						<text class="text-bold">4：确修复工艺</text>
					</view>
				</view>


				<view class="padding-sm flex">
					<view class="flex-1">
						<text class="text-red margin-right-xs">*</text>
						<text class="text-bold">修复工艺：</text>
					</view>
				</view>

				<view class="padding-sm flex align-center ">
					<view class="flex-3 ">
						<input v-model="formInfo.repairProcess" class="text-sm" style="width: 100%;" type="text"
							placeholder="暂未生成" />
					</view>
				</view>
				<view class="padding-sm flex align-center solid-bottom">
					<view class="flex-1">
						<text class="text-bold">描述：</text>
					</view>
					<view class="flex-3 ">
						<input v-model="formInfo.repairProcessDescribe" class="text-sm" style="width: 100%;" type="text"
							placeholder="暂未生成" />
					</view>
				</view>
				<view class="padding-sm flex solid-bottom bg-grey" id='step4'>
					<view class="flex-2">
						<text class="text-bold">5：维修开始</text>
					</view>
				</view>

				<view class="padding-sm flex solid-bottom">
					<view class="flex-3">
						<text class="text-red margin-right-xs">*</text>
						<text class="text-bold">维修开始时间：</text>
					</view>
					<view class="flex-3 ">
						<input v-model="formInfo.repairStartTime" class="text-sm" style="width: 100%;" type="text"
							placeholder="暂未生成" />
					</view>
				</view>
				<view class="padding-sm flex solid-bottom bg-grey" id='step5'>
					<view class="flex-2">
						<text class="text-bold">6：维修后</text>
					</view>
				</view>
				<view class="padding-sm flex solid-bottom">
					<view class="flex-2">
						<text class="text-red margin-right-xs">*</text>
						<text class="text-bold">维修人：</text>
					</view>
					<view class="flex-3">
						<uni-data-checkbox multiple v-model="formInfo.inspectionMemberNickName1" :max='4'
							:localdata="personList"></uni-data-checkbox>
					</view>
				</view>

				<view class="padding-sm flex">
					<view class="flex-1">
						<text class="text-red margin-right-xs">*</text>
						<text class="text-bold">维修后检测：</text>
					</view>
				</view>
				<view class="flex">
					<view class="flex-3">
						<uni-data-checkbox v-model="formInfo.inspectionResult" :localdata="range5"></uni-data-checkbox>
					</view>
				</view>
				<view class="padding-sm flex align-center solid-bottom">
					<view class="flex-1">
						<text class="text-red margin-right-xs">*</text>
						<text class="text-bold">说明：</text>
					</view>
					<view class="flex-3 ">
						<input v-model="formInfo.inspectionResultDescribe" class="text-sm" style="width: 100%;"
							type="text" placeholder="检结果测描述" />
					</view>
				</view>
				<view class="padding-sm">
					<view class="">
						<text class="text-red margin-right-xs">*</text>
						<text class="text-bold">维修后照片：</text>
					</view>
					<view class="margin-top-sm padding-sm">
						<htz-image-upload @imgDelete="imgDelete($event, 'inspectionImage')" :imgLoading="imgLoading"
							:max="10" v-model="formInfo.inspectionImageList" data-name="ceshiData"
							@chooseSuccess="zidingyiSuccess($event, 'inspectionImage', 'inspectionImageList')">
						</htz-image-upload>
					</view>
				</view>
			</block>


			<view class="padding-sm flex solid-bottom bg-grey" id='step6'>
				<view class="flex-2">
					<text class="text-bold">7：检验结论</text>
				</view>
			</view>
			<view class="padding-sm flex">
				<view class="flex-1">
					<text class="text-red margin-right-xs">*</text>
					<text class="text-bold">检验结论：</text>
				</view>
			</view>
			<view class="flex">
				<view class="flex-3">
					<uni-data-checkbox v-model="formInfo.inspectionConclusion" :localdata="range6"></uni-data-checkbox>
				</view>
			</view>

			<!-- <view class="padding-sm flex align-center solid-bottom">
				<view class="flex-3">
					<text class="text-red margin-right-xs">*</text>
					<text class="text-bold">维修人：</text>
				</view>
				<view class="flex-3 ">
					<input v-model="formInfo.inspectionMemberNickName" class="text-sm" style="width: 100%;" type="text"
						placeholder="暂未生成" />
				</view>
			</view> -->





		</view>
		<!-- </scroll-view> -->

		<view class="tpm-bottom-submit flex justify-around align-center" :style="[isNev?{'pointer-events':'none'}:{}]">
			<!-- <block>
				<button class="cu-btn bg-grey shadow" @tap="ScrollStepsMin">上一步</button>
			</block>
			<block>
				<button class="cu-btn bg-orange shadow" @tap="ScrollSteps">下一步</button>
			</block> -->
			<block class="" v-if="!isReadonly">
				<button class="cu-btn bg-green shadow padding-lr-xl" @tap="submitInfo('0')">保存</button>
				<button class="cu-btn bg-blue shadow padding-lr-xl" @tap="submitInfo('1')">提交</button>
			</block>
			<view class="" v-else>
				<text class="text-orange text-bold">{{btnText}}</text>
			</view>
		</view>

	</view>
</template>

<script>
	import helper from '../../common/helper';
	import moment from 'moment'
	import {
		deepClone,
		isEmpty,
		VhToPx
	} from '../../common/base';
	import htzImageUpload from '@/components/htz-image-upload/htz-image-upload.vue'
	export default {
		components: {
			htzImageUpload,
		},
		data() {
			return {
				btnText: '',
				authList: helper.authList,
				personList: [],
				requiredList: {
					"customerName": {
						"type": "string",
						"description": "客户名称"
					},
					"repairTime": {
						"type": "string",
						"format": "date-time",
						"description": "维修时间"
					},
					"inspectionStandard": {
						"type": "string",
						"description": "检验标准"
					},
					"repairMethod": {
						"type": "string",
						"description": "维修方法"
					},
					"isRepairable": {
						"type": "string",
						"description": "缺陷是否可修",
					},
					"defectDescribe": {
						"type": "string",
						"description": "缺陷说明",
						isRepair: true
					},
					"defectImage": {
						"type": "string",
						"description": "缺陷图片",
						isRepair: true
					},

					"repairProcess": {
						"type": "string",
						"description": "修复工艺",
						isRepair: true
					},
					"repairStartTime": {
						"type": "string",
						"description": "维修开始时间",
						isRepair: true
					},
					"inspectionResult": {
						"type": "string",
						"description": "维修后检测",
						isRepair: true
					},


					"inspectionResultDescribe": {
						"type": "string",
						"description": "维修后检测结果说明",
						isRepair: true
					},
					"inspectionImage": {
						"type": "string",
						"description": "维修后图片",
						isRepair: true
					},
					"inspectionConclusion": {
						"type": "string",
						"description": "检验结论"
					},
					"inspectionMemberNickName": {
						"type": "string",
						"description": "检验员姓名"
					},
				},
				num: 0,
				scroll: 0,
				basicsList: [{
					name: '维修设备信息',
					idName: 'step0'
				}, {
					name: '确认维修方法',
					idName: 'step1'
				}, {
					name: '解体检查',
					idName: 'step2'
				}, {
					name: '确定修复工艺',
					idName: 'step3'
				}, {
					name: '维修开始',
					idName: 'step4'
				}, {
					name: '维修后',
					idName: 'step5'
				}, {
					name: '检验结论',
					idName: 'step6'
				}],
				imgList: [],
				imgLoading: false,
				value: 0,
				range: [{
					"value": '工具解体检修',
					"text": "工具解体检修"
				}, {
					"value": "增材修复",
					"text": "增材修复"
				}],
				range2: [{
					"value": "可以修",
					"text": "可以修"
				}, {
					"value": "不可以修",
					"text": "不可以修"
				}],
				range5: [{
					"value": "维修完成",
					"text": "维修完成"
				}, {
					"value": "维修未完成",
					"text": "维修未完成"
				}],
				range6: [{
					text: '不合格',
					value: '不合格'
				}, {
					text: '合格',
					value: '合格'
				}],
				inputModal: false,
				isNev: false,
				modalName: '',
				imgLoading: false,
				repairInfo: {},
				equipmentLedger: {},
				ceshiData: [],
				CustomBar: this.CustomBar,
				tabSelect: 100,
				formInfo: {
					"createdOrgId": 0,
					"createdTime": "",
					"createdUserId": 0,
					"customerName": "",
					"defectDescribe": "",
					"defectImage": "",
					'defectImageList': [],
					"id": 0,
					"inspectionConclusion": "",
					"inspectionImage": "",
					inspectionImageList: [],
					"inspectionMemberId": 0,
					"inspectionMemberNickName": "",
					inspectionMemberNickName1: [],
					"inspectionResult": "",
					"inspectionResultDescribe": "",
					"inspectionStandard": "",
					"isRepairable": "",
					"materialCode": "",
					"model": "",
					"nowStep": "",
					"nowStepIndex": 0,
					"remark": "",
					"repairMemberId": 0,
					"repairMemberNickName": "",
					"repairMethod": "",
					"repairProcess": "",
					"repairProcessDescribe": "",
					"repairStartTime": "",
					"repairTime": "",
					"revision": 0,
					"serialNumber": "",
					"status": "",
					"storageLocation": "",
					"storageRegion": "",
					"tenantId": "",
					"toolName": "",
					"updatedTime": "",
					"updatedUserId": 0,
					"utcCode": ""
				},

			};
		},
		onLoad(obj) {
			if (obj.rowKey) {
				const params = {
					id: obj.rowKey
				}
				this.initForm(params)
			}
			if (obj.materialCode && obj.serialNumber && !obj.status) {
				this.handleInfo(obj)
			}
			if (obj.materialCode && obj.serialNumber && obj.status) {
				this.initForm(obj)
			}
			this.getPersonList()

		},
		computed: {
			isRepair() {
				return this.formInfo.isRepairable === '可以修'
			},
			isReadonly() {
				if (this.formInfo.status === '1') {
					this.btnText = '已完成单据不可编辑!'
					return true
				}
				if (!this.authList.includes('auth:role')) {
					this.btnText = '当前登录人不可编辑!'
					return true
				}
			}
		},
		methods: {
			getPersonList() {
				let that = this
				const params = {
					"userStatus": "1",
					"andDynamicQueryItems": [],
					"containRoleInfo": true,
					"pageSize": -1
				}
				this.$api.postAPI('/member/api/memberUser/list', params).then(res => {
					if (res.code == 0) {
						that.personList = res.data.rows.filter(el => el.postNameZhCn === '维修工').map(el => {
							return {
								value: el.nickName,
								text: el.nickName
							}
						})
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 3000
						});
					}
				})
			},
			ScrollSteps() {
				if (this.scroll === this.basicsList.length - 1) return
				this.scroll++
				this.getStep(this.scroll)
			},
			ScrollStepsMin() {
				if (this.scroll === 0) return
				this.scroll--
				this.getStep(this.scroll)
			},
			getStep(num) {
				let that = this
				const str = this.basicsList[num].idName
				this.scroll = num
				const query = uni.createSelectorQuery().in(this);
				query.select(`#${str}`).boundingClientRect(rect => {
					if (rect) {
						// 获取页面滚动距离
						uni.createSelectorQuery()
							.selectViewport()
							.scrollOffset(res => {
								// 计算目标位置的滚动距离
								const scrollTop = res.scrollTop + rect.top - that.CustomBar - VhToPx(15);
								// 滚动到目标位置
								uni.pageScrollTo({
									scrollTop: scrollTop,
									duration: 300 // 滚动动画时长
								})
							}).exec()
					}
				}).exec();
			},

			initForm(obj) {
				let that = this
				uni.showLoading({
					title: '查询中...'
				})
				const params = deepClone(obj)
				that.$api.postAPI('/tpm/api/repair/list', params).then(async res => {
					if (res.code == 0) {
						const obj = deepClone(res.data.rows[0])
						obj.inspectionMemberNickName1 = obj.inspectionMemberNickName.split(',')
						const urls = obj.inspectionImage
						const urls2 = obj.defectImage
						obj.inspectionImageList = await that.getImgUrl(urls)
						obj.defectImageList = await that.getImgUrl(urls2)
						that.formInfo = deepClone(obj)
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 3000
						});
					}
					uni.hideLoading()
				})
			},
			repairTimeChange(e) {
				this.formInfo.repairTime = e;
			},
			// 选择设备进入
			handleInfo(obj) {
				let that = this
				const params = deepClone(obj)
				that.$api.postAPI('/tpm/api/device/getByScan', params).then(res => {
					that.formInfo = res.data
					that.formInfo.repairTime = moment().format('YYYY-MM-DD HH:mm:ss')
				})
			},
			submitInfo(status) {
				console.log(deepClone(this.formInfo))
				let that = this
				if (!that.checkRequired(status)) return
				const params = deepClone(that.formInfo)
				params.status = status
				const API = params.id ? 'putAPI' : 'postAPI'
				uni.showLoading({
					title: '数据提交中...'
				})
				params.inspectionMemberNickName = params.inspectionMemberNickName1.join(',')
				this.$api[API]('/tpm/api/repair', params).then(res => {
					if (res.code == 0) {
						uni.hideLoading()
						uni.navigateBack()
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 3000
						});
					}
				})
			},
			// checkChange(e, key) {
			// 	let that = this
			// 	that.formInfo[key] = e.detail.value
			// 	that.formInfo.repairMethod = e.detail.value.join(',')
			// },
			selectChange2(res) {
				this.formInfo.list = res
			},
			mainCommit() {},
			uploadImages(src) {
				var that = this;
				return new Promise(function(resolve, reject) {
					// const formData = new FormData();
					let option = {
						// publicRead: true,
						serviceName: "TPM",
						bussinessModule: "repair"
					}

					that.$api.uploadImages('/oss/api/ossUploadRecord/upload', src, 'file', option,
						function(res) {
							resolve(res);
						})
				})
			},
			showInputModal() {
				var that = this;
				that.inputModal = true;
			},
			hideInputModal() {
				var that = this;
				that.inputModal = false;

			},

			goBackMenu() {
				var that = this;
				if (that.$helper.msgType == 1) {
					uni.reLaunch({
						url: '../menu/menu',
						success() {
							that.$helper.msgType = 0;
						}
					})
				} else {
					uni.navigateBack();
				}
			},


			async getImgUrl(urls) {
				let that = this
				if (isEmpty(urls)) return
				const urlList = urls.split(',')
				const showImgs = []
				for (let i = 0; i < urlList.length; i++) {
					let returnImg = await that.$api.generateSignedUrl({
						idList: [urlList[i]],
						imageSignedUrlFlag: true,
						pageSize: '-1'
					});
					if (returnImg.code == 0) {
						showImgs.push(returnImg.data.rows[0].imageSignedUrl);
					}

				}
				return showImgs
			},
			async zidingyiSuccess(res, key, copyKey) {
				var that = this;
				that.imgLoading = true;

				let toolImage = that.formInfo[key] ? that.formInfo[key].split(',') : [];
				let showImgs = [];
				for (let i = 0; i < res.length; i++) {
					let returnImg = await that.uploadImages(res[i]);
					if (returnImg.code == 0) {
						toolImage.push(returnImg.data.id);
					}
				}
				for (let i = 0; i < toolImage.length; i++) {
					let returnImg = await that.$api.generateSignedUrl({
						// path: toolImage[i],
						idList: [toolImage[i]],
						imageSignedUrlFlag: true,
						pageSize: '-1'
					});
					if (returnImg.code == 0) {
						showImgs.push(returnImg.data.rows[0].imageSignedUrl);
					}
				}
				that.imgLoading = false;
				that.formInfo[key] = toolImage.join(',');
				that.formInfo[copyKey] = showImgs;
			},
			imgDelete(res, key) {
				var that = this;
				const arr = that.formInfo[key].split(',')
				arr.splice(res.index, 1)
				that.formInfo[key] = arr.join(',')
			},
			checkRequired(status) {
				const {
					requiredList,
					isRepair,
					formInfo
				} = this;
				// 如果状态为 '0'，直接返回 true
				if (status === '0') return true;
				// 遍历 requiredList
				for (const key in requiredList) {
					const {
						description,
						isRepair: fieldIsRepair
					} = requiredList[key];
					const isEmptyField = isEmpty(formInfo[key]);
					// 判断是否需要校验
					const shouldValidate = (isRepair && isEmptyField) ||
						(!isRepair && !fieldIsRepair && isEmptyField);
					if (shouldValidate) {
						uni.showToast({
							title: `${description}为空!`,
							icon: 'none',
							duration: 3000
						});
						return false;
					}
				}
				return true;
			}
			// checkRequired(status) {
			// 	let that = this
			// 	if (status === '0') return true
			// 	for (let key in that.requiredList) {
			// 		if (that.isRepair && isEmpty(that.formInfo[key])) {
			// 			uni.showToast({
			// 				title: `${that.requiredList[key].description}为空!`,
			// 				icon: 'none',
			// 				duration: 3000
			// 			})
			// 			return false
			// 		}
			// 		if (!that.isRepair && !that.requiredList[key].isRepair && isEmpty(that.formInfo[key])) {
			// 			uni.showToast({
			// 				title: `${that.requiredList[key].description}为空!`,
			// 				icon: 'none',
			// 				duration: 3000
			// 			})
			// 			return false
			// 		}
			// 	}
			// 	return true
			// },


		}
	}
</script>

<style>
	.readonly-mb {
		position: absolute;
		top: 0;
		width: 100%;
		height: 100%;
		border: 1px solid #000;
		z-index: 111111;
	}

	.stepWrap {
		position: fixed;
		z-index: 9999;
	}

	.tpm-bottom-submit {
		position: fixed;
		bottom: 0;
		width: 100%;
		height: 100rpx;
		background-color: #FFFFFF;
		z-index: 1;
	}

	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>

<!-- <template>
	<view class="container">
		<view class="nav-buttons">
			<button @click="scrollToSection('section1')">Go to Section 1</button>
			<button @click="scrollToSection('section2')">Go to Section 2</button>
			<button @click="scrollToSection('section3')">Go to Section 3</button>
		</view>

		<view class="content">
			<view id="section1" class="section">Section 1</view>
			<view id="section2" class="section">Section 2</view>
			<view id="section3" class="section">Section 3</view>
		</view>
	</view>
</template>

<script>
	export default {
		methods: {
			// 滚动到指定区域
			scrollToSection(sectionId) {
				const query = uni.createSelectorQuery().in(this);
				query.select(`#${sectionId}`).boundingClientRect(rect => {
					if (rect) {
						// 获取页面滚动距离
						uni.createSelectorQuery()
							.selectViewport()
							.scrollOffset(res => {
								// 计算目标位置的滚动距离
								const scrollTop = res.scrollTop + rect.top;
								// 滚动到目标位置
								uni.pageScrollTo({
									scrollTop: scrollTop,
									duration: 300 // 滚动动画时长
								});
							})
							.exec();
					}
				}).exec();
			}
		}
	};
</script>

<style>
	/* 页面样式 */
	.container {
		display: flex;
		flex-direction: column;
		height: 100vh;
	}

	/* 导航按钮样式 */
	.nav-buttons {
		display: flex;
		justify-content: space-around;
		padding: 10px;
		background-color: #f0f0f0;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 1000;
	}

	.nav-buttons button {
		padding: 10px 20px;
		font-size: 16px;
		background-color: #007aff;
		color: white;
		border: none;
		border-radius: 5px;
	}

	/* 内容区域样式 */
	.content {
		flex: 1;
		padding-top: 60px;
		/* 避免导航栏遮挡内容 */
	}

	/* 每个区域的样式 */
	.section {
		height: 100vh;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 24px;
		color: white;
	}

	#section1 {
		background-color: #ff6b6b;
	}

	#section2 {
		background-color: #4ecdc4;
	}

	#section3 {
		background-color: #556270;
	}
</style> -->